On Mon, 9 Jun 2025 at 02:27, Alvaro Torres ***@***.***> wrote: *alvarotorrestx* left a comment (alvarotorrestx/DevConnect#126) <#126 (comment)> Ah... I completely understand you... I'm on the same path combined with school work. If you'd like I can complete this task since you've implemented a lot of it and I'll adapt it. Would that be ok? When you have more time open up you can throw in some more time with other tasks? @yogiwoo <https://github.com/yogiwoo> — Reply to this email directly, view it on GitHub <#126 (comment)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/AE7K5GMXVAWG7WHIQDG4LAL3CSPSRAVCNFSM6AAAAAB5KGXHJKVHI2DSMVQWIX3LMV43OSLTON2WKQ3PNVWWK3TUHMZDSNJUGI3TEOBSG4> . You are receiving this because you were mentioned.Message ID: ***@***.***>

On Wed, 11 Jun 2025 at 4:44 PM, 14 Yogesh kumar ***@***.***> wrote: i'll do that just give me some time On Mon, 9 Jun 2025 at 02:27, Alvaro Torres ***@***.***> wrote: > *alvarotorrestx* left a comment (alvarotorrestx/DevConnect#126) > <#126 (comment)> > > Ah... I completely understand you... I'm on the same path combined with > school work. > > If you'd like I can complete this task since you've implemented a lot of > it and I'll adapt it. Would that be ok? > > When you have more time open up you can throw in some more time with > other tasks? @yogiwoo <https://github.com/yogiwoo> > > — > Reply to this email directly, view it on GitHub > <#126 (comment)>, > or unsubscribe > <https://github.com/notifications/unsubscribe-auth/AE7K5GMXVAWG7WHIQDG4LAL3CSPSRAVCNFSM6AAAAAB5KGXHJKVHI2DSMVQWIX3LMV43OSLTON2WKQ3PNVWWK3TUHMZDSNJUGI3TEOBSG4> > . > You are receiving this because you were mentioned.Message ID: > ***@***.***> >

On Mon, 23 Jun 2025 at 01:00, Alvaro Torres ***@***.***> wrote: ***@***.**** requested changes on this pull request. ------------------------------ In client/src/assets/components/Jobs/JobDescriptions.jsx <#126 (comment)> : > + const [isMobile, setIsMobile] = React.useState(window.innerWidth < 768); + const [back,setBack] = useState(false) + React.useEffect(() => { + const handleResize = () => setIsMobile(window.innerWidth<768) + window.addEventListener("resize",handleResize); + handleResize(); + if(isMobile) setBack(false) + return ()=>window.addEventListener("resize",handleResize) + + }) + const BackButton=()=>{ + return <button className="p-2 w-40 bg-primary text-white rounded-full">BACK</button> + } The desired effect to resize and return would be using Tailwind CSS. useEffect in this case could cause performance issues and css is optimized already for responsiveness. Think you can redo the resizing and button in tailwind? Let me know. ------------------------------ In client/src/assets/components/Jobs/JobsMain.jsx <#126 (comment)> : > + <div className="jobdesc bg-base-100 w-[100%] col-span-12 rounded-md shadow-md p-4 overflow-y-auto h-[720px]"> + <button + className="mb-4 text-blue-500 underline" + onClick={() => setSelectedJob(null)} + > + ← Back to Job List + </button> Arrow and text can be centered for better UI. Think you can add a react-icon to it and match color scheme? ------------------------------ In client/src/assets/components/Jobs/JobsMain.jsx <#126 (comment)> : > +// import { use,useEffect } from "react"; +// import JobDescriptions from "./JobDescriptions"; +// import JobList from "./JobList"; +// import React from "react"; +// const JobsMain = () => { +// //const isMobile = window.innerWidth < 768; +// const [isMobile, setIsMobile] = React.useState(window.innerWidth < 768); +// useEffect(() => { +// const handleResize = () => { +// setIsMobile(window.innerWidth < 768); +// } +// window.addEventListener('resize', handleResize); +// handleResize(); +// return () => window.removeEventListener('resize', handleResize) }, +// []); + +// return ( +// <div className="w-[95%] mx-auto mt-5"> +// {/* Single grid container with 12 columns */} + +// {/* 4 left and 8 at right in */} +// <div className="grid grid-cols-12 gap-1"> +// {isMobile? +// (<div className="joblist bg-base-100 w-[100%] mx-auto col-span-12 rounded-md shadow-md p-4 overflow-y-auto h-[720px]"> +// <JobList/> +// </div> +// ) +// : +// (<><div className="joblist bg-base-100 w-[100%] mx-auto col-span-4 rounded-md shadow-md p-4 overflow-y-auto h-[720px]"> +// <JobList/> +// </div> +// <div className=" bg-base-100 w-[100%] mx-auto rounded-md shadow-md jobdesc col-span-8 p-4 overflow-y-auto h-[720px]"> +// {/* job title ,company icon ,job location , description , about us , responsibility , requiremnet , offers , location, message from hr */} +// <JobDescriptions/> +// </div></>) +// } +// </div> +// </div> +// ); +// }; + +// export default JobsMain; You can remove the extra comments if not needed anymore. — Reply to this email directly, view it on GitHub <#126 (review)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/AE7K5GOKU4HV6EVL5OTX6RD3E374JAVCNFSM6AAAAAB5KGXHJKVHI2DSMVQWIX3LMV43YUDVNRWFEZLROVSXG5CSMV3GSZLXHMZDSNBYGI4DOMBZGU> . You are receiving this because you were mentioned.Message ID: ***@***.***>

On Tue, 24 Jun 2025 at 10:03, Alvaro Torres ***@***.***> wrote: *alvarotorrestx* left a comment (alvarotorrestx/DevConnect#126) <#126 (comment)> Of course, TailwindCSS offers a range of built in media query resizings. Instead of using a useEffect, it may be ideal to do something for example: <button className="flex flex-wrap lg:hidden">This is a button</button> This allows the button to show and once it reaches "lg" screen size, it will hide. You can find more here: https://tailwindcss.com/docs/hover-focus-and-other-states#media-and-feature-queries @yogiwoo <https://github.com/yogiwoo> — Reply to this email directly, view it on GitHub <#126 (comment)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/AE7K5GK63SG5HXZZNDELWJ33FDILNAVCNFSM6AAAAAB5KGXHJKVHI2DSMVQWIX3LMV43OSLTON2WKQ3PNVWWK3TUHMZDSOJYG43DSMRTGU> . You are receiving this because you were mentioned.Message ID: ***@***.***>